
<!doctype html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title>地图Demo</title>
  <script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.8&key=af7d12153c62de85bda3e26781c645da"></script>
  <!-- https://lbs.amap.com/  高德地图开放平台
1.注册账号 得到key 放到 Thiskey
<script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.8&key=Thiskey"></script>
-->

  <style type="text/css">

    #wrapper {
      width: 1500px;
      height: 800px;
    }
  </style>
</head>

<body>

<div align="center">
  <div id="wrapper"></div>

</div>



<script type="text/javascript">
    window.onload = function () {


        AMap.plugin('AMap.Geolocation', function () {
            AMap.event.addListener(geolocation, 'complete', e => {
                console.log(e)
                // 定位成功之后做的事 // 定位成功之后再定位处添加一个marker
                console.log(e.position.lat)
                console.log(e.position.lng)
                var mapSet = []
                mapSet[1] = e.position.lat
                mapSet[0] = e.position.lng
                console.log(mapSet)
                var map = new AMap.Map('wrapper', {
                    resizeEnable: true,
                    center: mapSet, // 地图标记title
                    zoom: 12 // 地图视图缩放级别
                })
                //实例化点标记
                const marker = new AMap.Marker({
                    position: map.getCenter()
                })
                const marker1 = new AMap.Marker({
                    position:[104.06,	30.67],
                    title:"成都市",
                    icon: '//a.amap.com/jsapi_demos/static/demo-center/icons/dir-via-marker.png',
                    // 设置了 icon 以后，设置 icon 的偏移量，以 icon 的 [center bottom] 为原点
                    offset: new AMap.Pixel(-13, -30)
                })
                //marker.setTitle('成都市');
                marker.setLabel({
                    offset: new AMap.Pixel(20, 20),  //设置文本标注偏移量
                    content: "<div class='info'>我是 marker 的 label 标签</div>", //设置文本标注内容
                    direction: 'right' //设置文本标注方位
                });
                marker1.setMap(map)
                marker.setMap(map)
            })

            AMap.event.addListener(geolocation, 'error', e => {
                console.log(e) // 定位失败做的事
            })
        })



    }



</script>

</body>
</html>
